<script setup lang="ts">
import Detail from "./Detail.vue";
interface Props {
  modelValue?: string;
  mode: API.Form.Mode;
  controlAttr: API.Form.ControlAttrItem;
}
defineProps<Props>();

const emit = defineEmits(["update:modelValue"]);
const onChange = (value: string) => emit("update:modelValue", value);
</script>

<template>
  <van-field
    v-if="mode === 'edit'"
    class="clear-field"
    :placeholder="controlAttr.placeholder"
    :model-value="modelValue"
    @update:model-value="onChange"
  ></van-field>
  <Detail v-if="mode === 'read'" :value="modelValue" />
</template>

<style scoped lang="scss"></style>
